
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>添加管理员</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/views/static/common/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/views/static/admin/css/login.css">
    <script src="${pageContext.request.contextPath}/views/static/common/layui/layui.js"></script>
    <style>
        body{
            color: #E5DFD5;!important;
            background-color: rgba(255,255,255,0) !important;
        }
        .login{
            border-radius: 10px 10px;
        }
        input{
            border-radius: 10px;
            margin-bottom: 25px;
        }
    </style>
</head>

<body class="body2">

<div class="login">
    <h2> <strong><font face="仿宋" >BYTE酒店·添加管理员</font></strong></h2>
    <div style="color: red;text-align: center" id="msg">${msg}</div>
    <%--    表单加上target="_blank"，会打开新窗口--%>
    <form class="layui-form" method="post"  action="${pageContext.request.contextPath}/adminAdd" >

        <div class="layui-form-item">
            <input onblur="checkUsername(this)" type="text" name="username"  id="username" placeholder="用户名" class="layui-input" required >
            <i class="layui-icon input-icon">&#xe66f;</i>
        </div>

        <div class="layui-form-item">
            <input onblur="checkUserPassword(this)" type="password" name="password" id="password" placeholder="密码"  class="layui-input" required>
            <i class="layui-icon input-icon">&#xe673;</i>
        </div>

        <div class="layui-form-item">
            <button style="width: 100%" class="layui-btn layui-btn-radius layui-btn-normal" lay-submit lay-filter="login" >立即添加</button>
        </div>

        <br>

        <div>
            <a href="${pageContext.request.contextPath}/index">返回首页</a>
        </div>
    </form>

</div>

</body>

</html>
<script>
    function checkUsername(e) {
        let username = e.value;
        //发送ajax请求验证用户名
        let xhr = new XMLHttpRequest();
        //发送一个post请求到控制器查询数据库中的信息
        xhr.open("post","${pageContext.request.contextPath}/adminUserCheckUsername")
        xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xhr.send("username="+username)
        xhr.onreadystatechange = function (){
            if(xhr.readyState==4&&xhr.status==200){
                document.getElementById("msg").innerText = xhr.responseText;
            }
        }
    }
    function checkUserPassword(e) {
        let password = e.value;
        //发送ajax请求验证密码
        let xhr = new XMLHttpRequest();
        //发送一个post请求到控制器查询数据库中的信息
        xhr.open("post","${pageContext.request.contextPath}/adminUserCheckUsername")
        xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xhr.send("password="+password)
        xhr.onreadystatechange = function (){
            if(xhr.readyState==4&&xhr.status==200){
                document.getElementById("msg").innerText = xhr.responseText;
            }
        }
    }
</script>